
<template>
  <footer>
      <div v-for="(item,index) in list" :key="item.name">
    <router-link :to="{name:item.name}">
    <i class="iconfont" :class="item.icon"></i>
    <span>{{ item.text }}</span>
    <van-tag class="hot" v-if="item.hot" :color="$route.name==item.name?'#ff5f16':'#999'">{{ 5 }}</van-tag>
    </router-link>
    </div>
  </footer>
</template>

<script>
export default {
  data() {
    return {
      list: [
        {
          path: "/ms/home",
          name: "home",
          text: "首页",
          icon: "icon-home",
        },
        {
          path: "/ms/classify",
          name: "classify",
          text: "分类",
          icon: "icon-gengduo",
        },
        {
          path: "/ms/submit",
          name: "submit",
          text: "发布",
          icon: "icon-top",
        },
        {
          path: "/ms/mine",
          name: "mine",
          text: "我的",
          icon: "icon-mine",
          hot: true,
        },
      ],
    };
  },
};
</script>

<style>
@import "../styles/foot.scss";
@import "../styles/fonts/iconfont.css";
</style>